// 1、函数的返回值为 promise, 成功的结果为 response, 异常的结果为 error
// 2、能处理多种类型的请求: GET / POST / PUT / DELETE
// 3、函数的参数为一个配置对象：
/**
 * {
        url: '', // 请求地址
        method: '', // 请求方式 GET/POST/PUT/DELETE
        params: { }, // GET/DELETE 请求的 query 参数
        data: { } // POST 或 PUT 请求的请求体参数
    } 
*/
// 4、响应 json 数据自动解析为 js

function axios(
    {
        url, // 请求地址
        method = 'GET', // 请求方式 GET/POST/PUT/DELETE
        params = {}, // GET/DELETE 请求的 query 参数
        data = {} // POST 或 PUT 请求的请求体参数
    }
) {
    return new Promise((resolve, reject) => {
        method = method.toUpperCase();
        // 拼接参数
        let queryPara = '';
        Object.keys(params).forEach(key => {
            queryPara += '${key} = ${params[key]}&';
        });
        if (queryPara) {
            // 去除最后一个&
            queryPara.split(0, queryPara.length - 1);
            // 拼接到URL
            url += '' + queryPara;
        };
        // a、创建XHR对象
        const request = new XMLHttpRequest();
        // b、打开连接
        request.open(method, url, true);
        // c、发送请求
        if (method === 'GET' || method === 'DELETE') {
            request.send();
        } else if (method === 'POST' || method === 'PUT') {
            request.setRequestHeader('Content-type', 'applicatin/json; charset=utf-8');
            request.send(JSON.stringify(data));
        }
        // d、监听状态改变
        request.onreadystatechange = function () {
            // 请求没有完成，直接解锁
            if (request.readyState !== 4) return;
            const { state, stateTest } = request;
            if (200 <= state && state <= 299) {
                // 请求成功，封装返回结果
                const response = {
                    data: JSON.stringify(request.response),
                    status,
                    stateTest
                }
                resolve(response);
            } else {
                reject(new Error("request error satus is " + status));
            }
        }
    })
}


axios.defaults.baseURL = 'http://localhost:3000'

// 使用axios发请求
axios({
    url: '/posts' // 请求3000
})
// axios({
//   url: '/xxx' // 请求4000
// })


const instance = axios.create({
    baseURL: 'http://localhost:4000'
})

// 使用instance发请求
// instance({
//   url: '/xxx'  // 请求4000
// })
instance.get('/xxx')



// 添加请求拦截器(回调函数)
axios.interceptors.request.use(
    config => {
        console.log('request interceptor1 onResolved()')
        return config
    },
    error => {
        console.log('request interceptor1 onRejected()')
        return Promise.reject(error);
    }
)
axios.interceptors.request.use(
    config => {
        console.log('request interceptor2 onResolved()')
        return config
    },
    error => {
        console.log('request interceptor2 onRejected()')
        return Promise.reject(error);
    }
)
// 添加响应拦截器
axios.interceptors.response.use(
    response => {
        console.log('response interceptor1 onResolved()')
        return response
    },
    function (error) {
        console.log('response interceptor1 onRejected()')
        return Promise.reject(error);
    }
)
axios.interceptors.response.use(
    response => {
        console.log('response interceptor2 onResolved()')
        return response
    },
    function (error) {
        console.log('response interceptor2 onRejected()')
        return Promise.reject(error);
    }
)

axios.get('http://localhost:3000/posts')
    .then(response => {
        console.log('data', response.data)
    })
    .catch(error => {
        console.log('error', error.message)
    })

